import React, { useEffect } from "react";
import { useNavigate, Link } from "react-router-dom";
import { Button, Checkbox, Form, Input, message } from "antd";
import "./index.scss";
import { fetchLogin } from "@/store/modules/tokenStore";
import { useDispatch, useSelector } from "react-redux";

interface LoginFormValues {
  username: string;
  password: string;
  remember: boolean;
}

function Register() {
  const navigate = useNavigate();
  const dispatch = useDispatch();

  // 登录表单提交事件
  const onFinish = async (values: LoginFormValues) => {
    // await dispatch(fetchLogin(values));
    // const user = useSelector((state: any) => state.reducerToken.user);

    console.log("Success:", values);

    // 模拟登录成功后跳转到首页
    if (values.username === "admin" && values.password === "123456") {
      // 登录成功后跳转到首页
      navigate("/login");
      message.success("注册成功！");

      // localStorage.setItem("token", "admin"); // 存储token到localStorage
    }
  };

  return (
    <div className="reg_container">
      <div className="reg_container_box">
        <div className="container_title">Register</div>

        <Form
          name="basic"
          labelCol={{ span: 8 }}
          wrapperCol={{ span: 16 }}
          style={{ maxWidth: 600 }}
          initialValues={{ remember: true }}
          onFinish={onFinish}
          autoComplete="off"
        >
          <Form.Item
            label="Username"
            name="username"
            rules={[{ required: true, message: "Please input your username!" }]}
          >
            <Input placeholder="admin" />
          </Form.Item>

          <Form.Item
            label="Password"
            name="password"
            rules={[{ required: true, message: "Please input your password!" }]}
          >
            <Input.Password placeholder="123456" />
          </Form.Item>

          <Form.Item
            label="confPwd"
            name="confPwd"
            rules={[{ required: true, message: "Please input your confPwd!" }]}
          >
            <Input.Password placeholder="123456" />
          </Form.Item>

          <Form.Item label={null}>
            <Button type="primary" htmlType="submit">
              Submit
            </Button>
          </Form.Item>

          <Form.Item label={null}>
            <Link to="/login">Go login</Link>
          </Form.Item>
        </Form>
      </div>
    </div>
  );
}

export default Register;
